/* Design tokens: typography, colors (subset), spacing */
:root {
  /* Font families */
  --font-family-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';

  /* Font sizes */
  --font-size-12: 12px;
  --font-size-13: 13px;
  --font-size-14: 14px;
  --font-size-15: 15px;
  --font-size-16: 16px;
  --font-size-18: 18px;
  --font-size-20: 20px;

  /* Line heights */
  --line-height-tight: 1.2;
  --line-height-normal: 1.45;
  --line-height-relaxed: 1.6;

  /* Font weights */
  --font-weight-regular: 400;
  --font-weight-medium: 600;
  --font-weight-bold: 700;

  /* Semantic tokens */
  --font-title: var(--font-size-16);
  --font-subtitle: var(--font-size-14);
  --font-body: var(--font-size-13);
  --font-caption: var(--font-size-12);

  --weight-title: var(--font-weight-bold);
  --weight-subtitle: var(--font-weight-medium);
  --weight-body: var(--font-weight-regular);

  /* Colors for accents (align with pages) */
  --accent-primary: #409eff;
  --accent-success: #67C23A;
  --accent-warning: #E6A23C;
  --accent-danger: #F56C6C;
  --accent-info: #909399;
}

html, body, #app {
  font-family: var(--font-family-sans);
  font-size: var(--font-body);
  line-height: var(--line-height-normal);
}

/* Heading defaults used across cards/sections */
.h-title, .section-title, .card-header { 
  font-size: var(--font-title);
  font-weight: var(--weight-title);
}
.h-subtitle { font-size: var(--font-subtitle); font-weight: var(--weight-subtitle); }
.text-body { font-size: var(--font-body); font-weight: var(--weight-body); }
.text-caption { font-size: var(--font-caption); opacity: 0.8; }

/* Utility font-size classes */
.fs-12 { font-size: var(--font-size-12) !important; }
.fs-13 { font-size: var(--font-size-13) !important; }
.fs-14 { font-size: var(--font-size-14) !important; }
.fs-15 { font-size: var(--font-size-15) !important; }
.fs-16 { font-size: var(--font-size-16) !important; }
.fs-18 { font-size: var(--font-size-18) !important; }

.fw-regular { font-weight: var(--font-weight-regular) !important; }
.fw-medium { font-weight: var(--font-weight-medium) !important; }
.fw-bold { font-weight: var(--font-weight-bold) !important; }

/* Element Plus tweaks to unify typography */
.el-card__header { font-size: var(--font-title); font-weight: var(--weight-title); }
.el-table { font-size: var(--font-body); }
.el-table th .cell, .el-table td .cell { font-size: var(--font-body); }
.el-form-item__label { font-size: var(--font-body); }
.el-input__inner, .el-select__selected-item { font-size: var(--font-body); } 